<template>
  <TheTable
    tableID="applyEnd"
    :tableOption="tableOption"
    :pageNo.sync="pageNo"
    :limit.sync="limit"
    :api="queryPageApi"
    :queryParams="queryParams"
  />
</template>
<script>
import { apiCommercialVoucherList } from "@/api/invoice.js";
export default {
  data() {
    const _this = this;
    return {
      queryParams: { invoiceState: "ISSUED" },
      pageNo: 1,
      limit: 10,
      queryPageApi: apiCommercialVoucherList,
      tableOption: [
        {
          label: "id",
          prop: "commercialVoucherId",
          width: 120
        },

        {
          label: "金额",
          prop: "amountOfMoney",
          width: 120,
          formatter({ amountOfMoney }) {
            return this.$filters.filterPriceFormat(amountOfMoney || 0);
          }
        },
        {
          label: "状态",
          prop: "invoiceState",
          width: 120,
          formatter({ row }) {
            return "已开具";
          }
        },

        {
          label: "创建时间",
          width: 120,
          prop: "createTime",
          render(createElement, { row }) {
            try {
              const strArr = row.createTime.split(" ");
              const dom = (
                <div class="row">
                  <div>{strArr[0]}</div>
                  <div>{strArr[1]}</div>
                </div>
              );
              return dom;
            } catch (error) {
              return <div></div>;
            }
          }
        },
        {
          label: "完成时间",
          width: 120,
          prop: "finishTime",
          render(createElement, { row }) {
            try {
              const strArr = row.finishTime.split(" ");
              const dom = (
                <div class="row">
                  <div>{strArr[0]}</div>
                  <div>{strArr[1]}</div>
                </div>
              );
              return dom;
            } catch (error) {
              return <div></div>;
            }
          }
        },

        {
          label: "操作",
          width: 80,
          prop: "operate",
          fixed: "right",
          render(h, { row }) {
            return h("el-row", [
              h("el-link", {
                domProps: {
                  innerHTML: "查看明细"
                },
                props: {
                  type: "primary"
                },
                on: {
                  click() {
                    _this.$router.push({
                      path: "/financeManager/invoice/detail",
                      query: {
                        commercialVoucherId: row.id || "",
                        // invoiceState: "ISSUED"
                      }
                    });
                  }
                }
              }),
              h("el-link", {
                domProps: {
                  innerHTML: "下载发票"
                },
                class: ["ml20"],
                props: {
                  type: "success"
                },
                on: {
                  click() {
                    window.open(row.invoiceAddress);
                  }
                }
              })
            ]);
          }
        }
      ]
    };
  },
  mounted() {},
  methods: {}
};
</script>
